<template>
	<view class="index_content_basic">
		<view class="index_content_basic_main">
			<u--form :model="ruleForm" :rules="rules" label-position="top" ref="ruleForm" label-width="100px"
				class="demo-ruleForm">
				<u-form-item label="描述内容" prop="feedback">
					<u--textarea type="textarea" count  v-model="ruleForm.feedback" placeholder="请输入描述内容"></u--textarea>
				</u-form-item>
				<u-form-item label="问题截图" prop="">
					<UploadImageList :data="upLoadImages" @uploadImageClick="uploadImageClick_" />
				</u-form-item>
			</u--form>
		</view>
		<view class="position_footer flex aic jcsb">
			<u-button class="blue_btn" style="width: 100%;" type="primary" @click="submitForm('ruleForm')">保存
			</u-button>
		</view>
	</view>
</template>

<script>
	import {
		feedback
	} from "@/api/my.js"
	import UploadImageList from "@/pages/components/UploadImageList.vue"
	export default {
		components: {
			UploadImageList
		},
		data() {
			return {
				upLoadImages: {
					tip: "（最多上传10张，单张图片大小不超过2M，支持jpg、jpeg、png格式）",
					urls: "",
					limit: 10
				},
				ruleForm: {
					feedback: '',
					feedbackOssIds: ""
				},
				rules: {
					feedback: [{
						required: true,
						message: '请输入描述内容',
						trigger: 'blur'
					}]
				}
			};
		},
		onLoad(options) {
			this.resetForm()
		},
		methods: {
			submitForm(formName) {
				this.$refs.ruleForm.validate().then(valid => {
					if (valid) {
						let obj = this.ruleForm
						console.log(obj);
						feedback(obj).then(res => {
							uni.showToast({
								title: "保存成功",
								icon: 'success'
							})
							setTimeout(()=>{
								this.resetForm()
								uni.navigateBack(-1)
							},1000)
							
						}).catch(res => {
							uni.showToast({
								title: res.msg,
								icon: 'error'
							})
						})
					} else {
						console.log('error submit!!');
						return false;
					}
				});
			},
			resetForm() {
				this.ruleForm.feedback="";
				this.ruleForm.feedbackOssIds="";
				this.upLoadImages.urls=""
			},
			uploadImageClick_(value) {
				console.log("多图片：", value);
				this.ruleForm.feedbackOssIds = value.ossIds;
				// this.ruleForm.files = value.urls
			},
		}
	}
</script>

<style lang="scss" scoped>
	.blue_btn {
		height: 40px;
		background: #2F6CBC;
		border: 1px solid #2F6CBC;
	}
</style>
